<template>
  <d2-container>
    <el-form :inline="true" :model="dataSearch" ref="dataSearch">
      <el-form-item label="员工姓名" prop="name">
        <el-input v-model="dataSearch.name" placeholder="请输入员工姓名"></el-input>
      </el-form-item>
      <el-form-item label="校区" prop="school">
        <el-select v-model="dataSearch.school" filterable placeholder="全部">
          <el-option
            v-for="item in schoolList"
            :key="item._id"
            :label="item.name"
            :value="item._id"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="报告类型：" prop="type">
        <el-radio-group v-model="dataSearch.type">
          <el-radio :label="2">全部</el-radio>
          <el-radio :label="1">月报</el-radio>
          <el-radio :label="0">周报</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="formSubmit">
          <d2-icon name="search" />查询
        </el-button>
      </el-form-item>
      <el-form-item>
        <el-button @click="formReset">
          <d2-icon name="refresh" />重置
        </el-button>
      </el-form-item>
    </el-form>
    <el-table :data="reportList" border style="width: 100%">
      <el-table-column prop="staff.name" label="姓名"></el-table-column>
      <el-table-column prop="time" label="创建日期"></el-table-column>
      <el-table-column prop="type" label="报告类型"></el-table-column>
      <el-table-column fixed="right" label="操作">
        <template slot-scope="scope">
          <el-button @click="detailClick(scope.row)" type="text" size="small">查看详情</el-button>
          <!-- <el-button @click="deleteClick(scope.row)" type="text" size="small">删除</el-button> -->
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      background
      layout="total,sizes,prev, pager, next,jumper"
      :page-size="pageSize"
      :current-page="currentPage"
      :total="total"
      @current-change="handleCurrentChange"
      @size-change="handlerSizeChange"
    ></el-pagination>
    <el-dialog title="报告详情" :visible.sync="dialogTableVisible">
      <div style="margin:5px;">创建人：{{reportDetail.name}}</div>
      <div style="margin:5px;">报告类型：{{reportDetail.type}}</div>
      <div style="margin:5px;">报告时间：{{reportDetail.time}}</div>
      <div style="margin:5px;">报告内容：</div>
      <div style="margin:10px 35px;">{{reportDetail.content}}</div>
    </el-dialog>
  </d2-container>
</template>
<script>
// import { request } from "http";
import request from "@/plugin/axios";
import { constants } from "crypto";
import { mapState } from "vuex";
import formatTime from "@/libs/util.formatTime";
export default {
  data() {
    return {
      schoolList: [{ name: "全部", _id: 0 }],
      reportList: [],
      dataSearch: {
        name: "",
        school: 0,
        type: 2
      },
      pageSize: 10,
      currentPage: 1,
      total: 0,
      dataList: [],
      dialogTableVisible:false,
      reportDetail : {}
    };
  },
  computed: {
    ...mapState("d2admin/user", ["info"])
  },
  methods: {
    formSubmit() {
      this.getDataList(this.dataSearch);
    },
    formReset() {
      this.$refs.dataSearch.resetFields();
    },
    handleCurrentChange(currentPage) {
      this.currentPage = currentPage;
      this.getDataList(this.dataSearch);
    },
    handlerSizeChange(pageSize) {
      this.pageSize = pageSize;
      this.getDataList(this.dataSearch);
    },

    detailClick(e) {
      this.dialogTableVisible=true
      this.reportDetail = e
    },
    getDataList(dataSearch) {
      let data = {};
      if (dataSearch.school == 0) {
        data.school = this.info.school.map(e => {
          return e._id;
        });
      } else {
        data.school = dataSearch.school;
      }
      data.name = dataSearch.name;
      data.type = dataSearch.type;
      data.pageSize = this.pageSize;
      data.currentPage = this.currentPage;
      request({
        url: "/staff/getReportList",
        method: "post",
        data: data
      }).then(res => {
        if (res.code == 200) {
          this.total = res.data.count;
          res.data.report.forEach(e => {
            e.time = formatTime.formatTime(e.createdAt);
            e.type = e.type == 0 ? "周报" : e.type == 1 ? "月报" : "未知";
            e.name = e.staff.name
          });
          this.reportList = res.data.report;
          console.log(res);
        }
      });
    }
  },
  created() {
    this.schoolList = this.schoolList.concat(this.info.school);
    this.getDataList(this.dataSearch);
  }
};
</script>